iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 4
4
Modern Web

今晚,我想來點Blazor系列 第 4

Day 4:Hosting models

  • 分享至 

  • xImage
  •  

上一篇我們在建立Blazor專案時,看到有兩種Blazor專案可以選擇,分別是Blazor Server與Blazor WebAssembly,今天這篇我們要來看看這兩種專案的原理以及優缺點。

Blazor Server

https://ithelp.ithome.com.tw/upload/images/20200918/20130058n3wDuA4s0t.jpg

從字面上的Server兩字,可以猜到是跑在伺服器端的專案,主要有下列幾個優點:

  1. Blazor跑在Server上,使用者再操作UI元件時,觸發的事件將會用SignalR與後端做溝通處理。
  2. 由於資源放在伺服器端,初次載入速度會比Blazor WebAssemly還快。

另外幾個缺點如下:

  1. UI延遲:user每次與Blazor App的互動,例如按下某個按鈕,都會透過網路與後端溝通,因此會有些許延遲情形出現。
  2. 如果與後端連線失敗,Blazor App將會無法執行。

Blazor WebAssembly

https://ithelp.ithome.com.tw/upload/images/20200918/20130058FIiecj95xA.jpg

在介紹Blazor WebAssembly之前,我們先來簡單認識一下WebAssembly是什麼樣的技術。WebAssembly是在2015年由幾個主流瀏覽器廠商,共同推動的網頁格式新標準。WebAssembly是一種二進位格式的低階程式語言,只要你使用的程式語言能夠編譯成WebAssembly,那就可以以近原生的速度,跑在瀏覽器上。而現今許多程式語言都可編譯成WebAssembly,例如Java、Ruby、Python等等,在C#中,則是透過Blazor WebAssembly框架來編譯成WebAssembly,並且不用再安裝其他的Plugin或Code transpiler就可以執行。

Blazor WebAssembly的幾個優點如下:

  1. UI低延遲:由於全跑在瀏覽器上,不須從server端取得Component的狀態,因此回應速度快很多。
  2. 高分散處理:瀏覽器載入編譯成WebAssembly的.NET程式,因此不像Blazor Server一樣頻繁地與Server溝通,減輕了Server的壓力。
  3. 可部署到Github Page這一類的靜態網站主機

另外Blazor WebAssembly的缺點如下:

  1. 初次載入速度慢:瀏覽器在初次載入Blazor App時,要下載.NET runtime和相依套件。
  2. 部分瀏覽器不支援WebAssembly技術,例如IE

Blazor Server、Blazor WebAssembly,該如何選擇?

下面整理了幾個不同之處,希望能減少一點選擇障礙。
項目 | Blazor WebAssembly | Blazor Server
------------- | -------------
載入速度 | | 勝
執行速度 | 勝 |
是否需要Server | 不需要 | 需要
IE可執行 | IE不支援WebAssembly | IE11+


上一篇
Day 3:安裝
下一篇
Day 5:專案結構
系列文
今晚,我想來點Blazor30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言